<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
     <head>
        <title>Bootstrap 模板</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <!-- 引入 Bootstrap -->
       <!--  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> -->
        <link href="bootstrap.css" rel="stylesheet">
   
        <!-- HTML5 Shiv 和 Respond.js 用于让 IE8 支持 HTML5元素和媒体查询 -->
        <!-- 注意： 如果通过 file://  引入 Respond.js 文件，则该文件无法起效果 -->
        <!--[if lt IE 9]>
           <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
           <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
        <![endif]-->
     </head>
     <body>
        <div class="container">
    <div class="row clearfix">
      <div class="col-md-12 column">
        <nav class="navbar navbar-default navbar-inverse" role="navigation">
          <div class="navbar-header">
             <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button> <a class="navbar-brand" href="#">Brand</a>
          </div>
          
          <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
              <li class="active">
                 <a href="#">Link</a>
              </li>
              <li>
                 <a href="#">Link</a>
              </li>
              <li class="dropdown">
                 <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown<strong class="caret"></strong></a>
                <ul class="dropdown-menu">
                  <li>
                     <a href="#">Action</a>
                  </li>
                  <li>
                     <a href="#">Another action</a>
                  </li>
                  <li>
                     <a href="#">Something else here</a>
                  </li>
                  <li class="divider">
                  </li>
                  <li>
                     <a href="#">Separated link</a>
                  </li>
                  <li class="divider">
                  </li>
                  <li>
                     <a href="#">One more separated link</a>
                  </li>
                </ul>
              </li>
            </ul>
            <form class="navbar-form navbar-left" role="search">
              <div class="form-group">
                <input type="text" class="form-control" />
              </div> <button type="submit" class="btn btn-default">Submit</button>
            </form>
            <ul class="nav navbar-nav navbar-right">
              <li>
                 <a href="#">Link</a>
              </li>
              <li class="dropdown">
                 <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown<strong class="caret"></strong></a>
                <ul class="dropdown-menu">
                  <li>
                     <a href="#">Action</a>
                  </li>
                  <li>
                     <a href="#">Another action</a>
                  </li>
                  <li>
                     <a href="#">Something else here</a>
                  </li>
                  <li class="divider">
                  </li>
                  <li>
                     <a href="#">Separated link</a>
                  </li>
                </ul>
              </li>
            </ul>
          </div>
          
        </nav>
        <div class="jumbotron">
          <h1>
            Hello, world!
          </h1>
          <p>
            This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.
          </p>
          <p>
             <a class="btn btn-primary btn-large" href="#">Learn more</a>
          </p>
        </div>
      </div>
    </div>
    <div class="row clearfix">
      <div class="col-md-4 column">
        <h2>
          Heading
        </h2>
        <p>
          Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
        </p>
        <p>
           <a class="btn" href="#">View details »</a>
        </p> <button type="button" class="btn btn-default active btn-info btn-block">按钮</button>
      </div>
      <div class="col-md-4 column">
        <h2>
          Heading
        </h2>
        <p>
          Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
        </p>
        <p>
           <a class="btn" href="#">View details »</a>
        </p> <button type="button" class="btn btn-default btn-block btn-info active">按钮</button>
      </div>
      <div class="col-md-4 column">
        <h2>
          Heading
        </h2>
        <p>
          Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
        </p>
        <p>
           <a class="btn" href="#">View details »</a>
        </p> <button type="button" class="btn btn-default btn-block active btn-info">按钮</button>
      </div>
    </div>
  </div>
   
        <!-- jQuery (Bootstrap 的 JavaScript 插件需要引入 jQuery) -->
        <script src="https://code.jquery.com/jquery.js"></script>
        <!-- 包括所有已编译的插件 -->
        <script src="bootstrap.js"></script>
     </body>
  </html>